<template>
  <div class="header">
    <div class="align-items_center p_lg">
      <div>
        <van-image
          class=""
          round
          @click="navigate('/modules/center/src/personal')"
          width="4rem"
          height="4rem"
          :src="user.nick_name"
        />
      </div>
      <div class="flex px_sm">
        <p class="username">{{user.avatar}}</p>
        <!-- <p class="phone">18200001111</p> -->
      </div>
      <!-- <div>
        <van-icon name="phone-o" size="2rem" />
      </div> -->
    </div>
  </div>
</template>

<script lang="ts">
import { defineComponent, onMounted, ref } from 'vue';
import '../styles/index.scss';
import { navigate } from "@/service/navigate";
export default defineComponent({
  setup() {
    const user = ref({})
    function loginAction() {
      uni.login({
        provider: 'weixin',
        success({ code }) {
          console.log('code', code);
          uni.getUserInfo({
            provider: 'weixin',
            success({ userInfo }) {
              user.value = userInfo
              // login({
              //   code,
              //   ...infoRes.userInfo,
              // })
            },
          });
        },
      });
    }

    onMounted(() => {
      loginAction();
    });
    return {
      navigate,
      user,
    }
  }
});
</script>

<style lang="scss" scoped></style>

